<div>
    <input #newHero (keyup.enter)="addHero(newHero.value);newHero.value=''">
    <button (click)="addHero(newHero.value);">Add</button>
    <button (click)="newHero.value=''">clear</button>
    <ul>
        <li *ngFor="let hero of heroes;let i = index">
            <p style="min-width:100px;">{{hero}}</p>
            <button (click)="delHero(i)">delete</button>
        </li>
    </ul>
</div>